<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"/>
    <meta content="telephone=no,email=no" name="format-detection">
    <!--禁止自动识别电话号码和邮箱-->
    <meta content="yes" name="apple-mobile-web-app-capable">
    <!--苹果手机：会删除默认的工具栏和菜单栏，网站开启对web app程序的支持-->
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <!--苹果手机：在web app应用下状态条（屏幕顶部条）的颜色,默认值为default（白色），可以定为black（黑色）和black-translucent（灰色半透明）。-->
    <meta name="apple-touch-fullscreen" content="yes"/>
    <!--苹果手机：如果把一个web app添加到了主屏幕中，那么从主屏幕中打开这个web app则全屏显示-->
    <link rel="stylesheet" type="text/css" href="css/management.css">
    <title></title>
    <script src="js/jquery-3.3.1.js"></script>
    <script src="js/layer.js"></script>
    <script src="js/utils.js"></script>
</head>
<body>
<div id="vueData">
    <header>
        <div>
            <div class="title_header dis_flex">
                <div class="dis_flex" @click="goBack">
                    <img src="img/return_3.png">
                </div>
                <div>
                    <span>区域管理</span>
                </div>
                <div></div>
            </div>
            <div class="dis_flex">
                <div class="dis_flex">
                    <span>{{storeInfo.name}}</span>
                    <span>电话：{{storeInfo.phone}}</span>
                </div>
                <div class="dis_flex" @click="toRegisterView">
                    <span class="col_cheng">注册业务员</span>
                </div>
            </div>
        </div>
        <div class="dis_flex data_cx">
            <input type="date" v-model="startDate">
            至
            <input type="date" v-model="endDate">
            <button @click="launchQuery">查询</button>
        </div>
        <div class="dis_flex data_cx">
            <span>我的业绩：{{regionAchievement}}</span>
            <div class="col_hui">
                <span>业务员数：</span>
                <span>{{subordinateNum}}</span>
            </div>
        </div>
        <div>业务员列表</div>
    </header>
    <div class="body">
        <div>
            <div class="Salesman" v-for="item in salesMans">
                <div class="dis_flex">
                    <img src="img/ywyct.png">
                    <div class="dis_flex">
                        <div class="dis_flex col_hui">
                            <span class="fon_18">业务员名称：{{item.name}}</span>
                            <span>电话：{{item.phone}}</span>
                        </div>
                        <span class="col_cheng">业绩：{{item.achievement}}</span>
                    </div>
                </div>
                <div class="dis_flex">
                    <span class="col_cheng fon_32">{{item.sellerNum}}</span>
                    <span class="col_hui fon_18">店铺数</span>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    let localStore = JSON.parse(localStorage.localStore), pageIndex = 1, pageCount = 20, totalPage = 0;
    let vm = new Vue({
        el: '#vueData',
        data: {
            imagePath: '/yapingzh/picture/',
            salesMans: [],
            subordinateNum: 0,
            storeInfo: localStore,
            regionAchievement: 0,
            startDate: '',
            endDate: '',
        },
        methods: {
            toRegisterView() {
                location.href = 'register.html?registerTypeId=4';
            }, goBack() {
                history.back();
            }, launchQuery() {
                emptyData();
                loadSalesManArray();
            }
        }
    });
    $(function () {
        loadSalesManArray();
    });

    function emptyData() {
        let ary = vm.salesMans;
        ary.splice(0, ary.length);
        vm.salesMans = ary;
        pageIndex = 1;
        totalPage = 0;
    }

    function loadSalesManArray() {
        $.ajax({
            url: '/shanduonewretail/jseller/selectregionsubordinate',
            data: {
                token: localStore.token,
                page: pageIndex,
                pageSize: pageCount,
                startDate: vm.startDate === '' ? '' : vm.startDate,
                endDate: vm.endDate === '' ? '' : vm.endDate
            },
            dataType: 'json',
            success: function (res) {
                if (res.success) {
                    vm.salesMans = vm.salesMans.concat(res.result.data);
                    totalPage = res.result.totalPage;
                    vm.subordinateNum = res.result.subordinateNum;
                    vm.regionAchievement = res.result.regionAchievement;
                }
            }, error: function () {
                toast('网络请求失败')
            }
        });
    }
</script>
</html>